<!DOCTYPE html>
<html>
<head>
    <title>fc@aliyun $ </title>
    <link rel="icon" type="image/png" href="https://img.alicdn.com/tfs/TB1M2X_QVXXXXXmXpXXXXXXXXXX-72-73.png">
    <link rel="stylesheet" href="http://getskeleton.com/dist/css/normalize.css">
    <link rel="stylesheet" href="http://getskeleton.com/dist/css/skeleton.css">
    <link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
    <style>
      body {
        margin: 100px 0;
        font-family: 'Inconsolata', monospace;
        font-size: 14px;
        color: #dfe1e8;
        background: #343d46;
      }
      #app, div.input-area {
        height: 400px;
        width: 100%;
      }
      div#main {
          max-width: 560px;
          background: #2b303b;
          border-radius: 0px 0px 5px 5px;
          height: 400px;
          -webkit-box-shadow: 0px 0px 13px 0px rgba(50, 50, 50, 0.59);
          -moz-box-shadow:    0px 0px 13px 0px rgba(50, 50, 50, 0.59);
          box-shadow:         0px 0px 13px 0px rgba(50, 50, 50, 0.59);
          overflow: hidden;
      }
      .holder {
          overflow: auto;
      }
      .prompt {
        color: #d28445;
      }
      input[type=text], input[type=text]:focus {
        border: none;
        padding: 0;
        margin: 0;
        height: 22px;
        background: #2b303b;
        color: #ebcb8b;
        width: 80%;
      }
      p {
        margin-bottom: 0;
        line-height: 21px;
      }
      #bar {
        height: 30px;
        max-width: 560px;
        background: black;
        border-radius: 5px 5px 0px 0px;
      }
      #content {
        padding: 0px 0px 0px 4px;
        height: 100%;
      }
    </style>
</head>
<body>
  <a href="https://github.com/awesome-fc/give-me-a-shell-web">
    <img style="position: absolute; top: 0; left: 0; border: 0;" src="https://camo.githubusercontent.com/82b228a3648bf44fc1163ef44c62fcc60081495e/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f6c6566745f7265645f6161303030302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_left_red_aa0000.png" />
  </a>
  <div id="bar" class='container'>
    <svg height="20" width="100">
      <circle cx="24" cy="14" r="5" fill="#bf616a" />
      <circle cx="44" cy="14" r="5" fill="#ebcb8b" />
      <circle cx="64" cy="14" r="5" fill="#a3be8c" />
    </svg>
  </div>
  <div class="container" id="main">
    <div class="holder" id="holder">
      <div id="content">
        <div id="app"></div>
      </div>
    </div>
  </div>
  <script type="text/javascript" src="build/main.min.js"></script>
</body>
</html>
